طراحی وب سایت
درباره سایت
آخرین مطالب
امکانات وب
پردازش فرم ها با زبان PHP
فرم ها يکي از مهمترين و شايد جالب ترين کاربردهاي زبان قدرتمند PHP مي باشد ، فرم ها در طراحی وب سایت کاربردهاي بسيار زيادي را دارند ، اين کاربرد ها از قبيل :ثبت کاربران جديد ، دريافت سفارش در فروشگاه هاي اينترنتي ، ارسال فيدبک و ... مي باشند
همانطور که ملاحظه نموديد ، همه ي اين فرم ها دقيقا به يک صورت عمل يا پردازش مي شوند ، ايجاد يک فرم و طراحی وب سایت آن با استفاده از زبان HTML و CSS صورت مي گيرد ولي پردازش اين فرم يا به عبارتي ديگر کاري که فرم انجام مي دهد مثلا ارسال ايمل توسط يکي از زبان هاي تحت سرور همانند PHP و يا ASP صورت مي گيرد.
در اين سري مجموعه هاي آموزش پردازش فرم در سون لرن سعي مي کنيم تا شما را به صورت کامل و کاربردي با پردازش فرم همراه با يک يا دو پروژه عملي مثل ساخت Quizو يا فرم تماس با ما آشنا خواهيم کرد.
در ابتدا ما قصد داريم يک فرم را با بک سري فيلد هاي مشخص تعريف نمائيم:
نام و نام خانوادگي
ايميل
پيام شما
1 <form action="" method="post">
2 Name: <input type="text" name="name" />
3 Email: <input type="text" name="email" />
4 Comment: <input type="text" name="comment" />
5 <input type="submit" />
6 </form>
از اين پس ما بر بخش آموزش پردازش فرم با php با اين فرم کار طراحی وب سایت خواهيم کرد.
اما قبل از اينکه شروع به کد نويسي براي پردازش فرم ها نمائيم ، بهتر شما را با تفاوت متدهاي Get و Post آشنا سازيم:
تفاوت دو متد Get و Post :
بهترين طريقه آموزش طراحی وب سایت براي نمايش تفاوت بين اين دو متد ، استفاده از فرم مي باشد ، ما با همان فرم قبلي کار خود را شروع مي کنيم ، در ابتدا فرم خود را از متد Post به Get تبديل نمائيد :
1 <form action="" method="get">
سپس فرم خود را در xampp اجرا نمائيد ، حال اگر شما هر فيد نام ، ايميل و پيام را وارد نمائيد و دکمه Submit را کليک کنيد ، در نوار آدرس مرورگر خود با آدرس زير مواجه مي شويد:
http://localhost/xampp/aaa.php?name=MiladHeydari&email=miladbruce%40live.com&comment=i+love+the+world!
همانطور که ملاحظه نموديد ، شما تمام مقاديري که در فيلدهاي خود وارد نموديد ، در نوار آدرس مشخص گرديد ، پس يعني متد Get چندان ايمن يا Secure نيست!
اما هم اکنون متد فرم خود را از Get به Post تغيير دهيد :
1 <form action="" method="post">
حال اگر فيلدهاي طراحی وب سایت فرم خود را پر کنيد ف و بر روي دکمه Submit کليک نمائيد ، هيچ گونه تغييري را در نوار آدرس مرورگر خود ملاحظه نخواهيد کرد.
نتيجه گيري :
همان طور که ديديد ، متد Get داده هاي شما را به صورتي نمايش مي دهد که در معرض ديد است و همچنين مرورگرهايي همچون Inteet Explorer يک محدوديت کارکتري در نوار آدرس را براي خود ايجاد کرده اند به طول 2048 کاراکتر ، بنابراين از متد Get فقط زماني استفاده مي شود که پاسخ فرم ما بسيار کوتاه باشد و همچنبن متد Get چندان ايمن نيست!
ولي در مقابل متد Post ايمن تر بوده و مي توان اطلاعات يک فرم را به اندازه 8 مگابايت کاراکتر پردازش کرد ، به طور معمول اکثرا از متد Post براي فرم ها استفاده مي کنند ولي Get نيز کاربرد خاص خود را دارد به عنوان مثال اکثر سايت هايي که امکان جستجو را به کاربران خود مي دهند ، فرم جستجوي خود را با متد Get طراحي کرده اند ، در اين صورت اين کار مي تواند حتي باعث افزايش بازديد نيز شود و همچنين کاربران مي توانند آدرس جستجو را در مرورگر خود BookMark نمايند.
ساده و منطقي است. مرورگر HTML را مثل وقتي که شما انگليسي را ميخوانيد مي خواند: از بالا به پايين و از چپ به راست. بنابراين يک سند HTML ساده با آن چيزي که بايد اول بيايد شروع مي شود، و با آن چيزي که بايد در انتها بيايد به آخر مي رسد.
اولين کاري که نياز داريد انجام دهيد، اين است که به مرورگر بگوييد که، شما با زبان HTML مي خواهيد با او گفت و گو کنيد. اين کار با برچسب <html> انجام مي شود. بنابراين قبل از اينکه هر کاري را غير از اين انجام دهيد، برچسب <html> را در اولين خط از سندتان در برنامه notepad تايپ کنيد.
همانطور که ممکن است از درس هاي قبل به ياد داشته باشيد، <html> يک برچسب باز است و بايد زماني که نوشتن کدهاي html تان به پايان رسيد، با برچسب بسته به اتمام برسد. بنابراين براي اينکه مطمئن شويد که برچسب بسته را فراموش نمي کنيد، طراحی وب سایت حال <htm/> را در دو خط پايين تر تايپ کنيد و بقيه کدهاي اچ تي ام ال را بين <html> و <html/> تايپ کنيد.
مورد بعدي که سندتان به آن احتياج دارد برچسب <head> است، که اطلاعاتي را در مورد صفحه آماده مي کند. و <body> که محتواي سندتان در آن وجود دارد. به دليل اينکه اگر HTML منطقي نباشد بي ارزش ميشود، برچسب باز و بسته head، بايد بالاي برچسب باز و بسته body قرار گيرد.
برچسب: طراحی وب سایت,طراحی سایت,طراحی وب, نویسنده: ali تاريخ: سه شنبه 28 خرداد 1392 ساعت: 13:56
مزایای طراحی وب سایت با div نسبت به table
دسته بندی : آموزش html، طراحی وب سایت ، اخبار اینترنت
حتما شنیدید که خیلی جاها توصیه میشه که برای Layout صفحه بجای Table از Div استفاده کنید. اما چرا؟
وظیفه اصلی تگ div در واقع چیدمان صفحه و طراحی قالب صفحه است و به همین دلیل است که نسبت به table فوق العاده انعطاف پذیرتر است. شما براحتی می توانید یک div را در هر مکانی از صفحه در کوتاهترین زمان قرار بدهید. حالا به این انعطاف پذیری قابلیت حرکت ( انتقال ) را که با کمک تکنولوژی آژاکس اضافه شده نیز بی افزایید.
از طرف دیگر، div کد کمتر و بهینه تری (<div> </div>) نسبت به یک table (که معادل <table><tr><td></td></tr></table>) ایجاد می کند. که این هم باعث کاهش حجم صفحه تولیدی می شود و هم باعث لود شدن سریعتر صفحه .
نکته دیگری که وجود دارد آن است که crawler ها که وظیفه جستجوی و ذخیره کردن طراحی وب سایت را برای موتورهای جستجو ( مثلگوگل ) بعهده دارند. چون بصورت معنایی صفحات را crawl می کنند بنابراین اگر صفحه شما بهتر و معنایی تر ایجاد شده باشد ، ازPage rank بالاتری هم برخوردار خواهد بود. مشکل Crawler ها در ایجاد ارتباط بین مطالب داخل تیبل است. زمانیکه شما مطالب مرتبط با یک موضوع را در بخش های مختلف یک تیبل قرار میدید Crawler ها در نحوه ارتباط این بخش ها با هم و همچنین نحوه ارتباطشون با مطلب اصلی دچار سردرگمی میشن.
نکته دیگری که یک div را در قالب بندی دردرجه بالاتری قرار می دهد، انعطاف پذیری آن در CSS هاست. به این معنی که شما می توانید یک قالب چندین منظوره ایجاد کنید و بعد با تغییر مکان div ها که با css انجام می دهید . کل قالب صفحه تغییر شکل پیدا می کند.
حالا با این همه برتری div نسبت به table ممکن است برای شما این سوال ایجاد شود که table برای چه مواردی باید استفاده شود. طراحی وب سایت html همانطور که div را برای قالب بندی وقرار دادن متن و تصویر پیاده سازی کردند. table را هم برای ایجاد صفحات به شکل Tab و ایجاد جداول ( لیست های موجود در صفحه) بوجود آوردند. در اکثر مواقع توصیه می شود که برای پیاده سازی Tab ها از table استفاده کنید. همانطور که مسلما خود شما هم متوجه شدید با استفاده از یک table براحتی می توان یک tab را پیاده سازی کرد. درصورتی که اگر بخواهید همان tab را با div پیاده سازی کنید باید زمان و انرژی بیشتری صرف کنید.
در کل با توجه به این نکات کلیدی :
حجم کمتر صفحه طراحی وب سایت تولید شده
Page rank بالاتر در گوگل و سایر search engine ها
قالب انعطاف پذیرتر
برای قراردادن متن و تصویر در وب توصیه شده که از div استفاده شود
کنترل بیشتر بوسیله css
جدول صرفا برای ساختار tabی مناسب است
کنترل و حرکت توسط آژاکس
…
به شما اکیدا توصیه می کنم که بجای استفاده از table در قالب بندی صفحات از div استفاده کنید و از قدرت آن لذت ببرید.
....
آموزش ساخت طراحی وب سایت با Dreamweaver CS4
آموزش ساخت وب سايت با Dreamweaver CS4
عنوان اصلي : Creating First Web Site In Dreamweaver CS4
آموزش طراحی وب سایت بسيار زيبا اما ساده در نرم افزار Adobe Dreamweaver CS4 به مدت زمان 2 ساعت و 40 دقيقه در آموزش مالتي مديا محصول موسسه آموزشي Lynda ارائه شده بر روي 1 حلقه CD به همراه فايل هاي تمريني
اين آموزش پروسه طراحي يك سايت را در نرم افزار دريم ويور CS4 به شما مي آموزد از ساختن يك صفحه ساده HTML تا استايل گذاري بر روي آن بوسيله CSS و همچنين نحوه ساخت انواع فرم ها به عنوان مثال فرم تماس با ما .
اين مجموعه آموزش بهترين مجموعه آموزش طراحی وب سایت براي شروع آموختن طراحي وب است .
در ادامه با برخي از سرفصل هاي درسي اين مجموعه آموزش Dreamweaver CS4 آشنا مي شويم :
آشنايي با مدرس مجموعه و سرفصل هاي اين كورس آموزشي از زبان مدرس شامل 3 درس
آموزش مفاهيم اوليه وب و وب سايت ها شامل 3 درس
آموزش ساخت صفحات وب در دريم ويور شامل 5 درس
آموزش اعمال CSS ها براي سبك بندي صفحات وب در Adobe Dreamweaver CS4 شامل 4 درس
آموزش پيشرفته CSS ها در Dreamweaver CS4 شامل 5 درس
آموزش ذخيره و استفاده از قالب ها در Dreamweaver CS4 شامل 1 درس
آموزش وارد كردن تصاوير در صفحات طراحی وب سایت شامل 2 درس
آموزش ساخت Photo Gallery و كاربرد فايل هاي فلش در صفحات وب شامل 3 درس
آموزش ساخت فرم تماس وب سايت در Dreamweaver CS4 شامل 2 درس
آموزش تست كردن نهايي براي رفع ايرادات آن و در نهايت آموزش كامل قرار دادن يك وب سايت بر روي اينترنت شامل 3 درس
و چندين و چند آموزش كاربردي ديگر مانند آموزش آماده سازي وب سايت براي موتورهاي جستجو ، استفاده از FTP و بسياري موارد ديگر
برچسب: طراحی وب سایت,طراحی سایت,طراحی وب, نویسنده: ali تاريخ: شنبه 25 خرداد 1392 ساعت: 15:07